<template>
  <div class="xueyuan">
    <div class="guan">
      <div class="fangkuai"> </div>
      <span>学员管理</span>
    </div>
    <Sou @souParent="souParent" @souZhi="souZhi"/>
    <Liebiao/>
    <Tatel :arr="arr" @shuayin="getStuData" @openDiale="openDiale"/>
    <Fen/>
    <Diaog v-if="isShow" :row="row"/>
  </div>
</template>

<script>
import Sou from './components/soushuo.vue'
import Tatel from './components/Tatel.vue'
import Fen from './components/Fen.vue'
import { getStu } from '../../api/Student'
import Diaog from './components/Dialog.vue'
import Liebiao from './components/Liebiao.vue'

export default {
components:{
  Sou,
  Tatel,
  Fen,
  Diaog,
  Liebiao
},
data(){
  return{
    arr:[],
    search:'', 
    page:1,
    pageSize:10,
    row:{},
    isShow:false
  }
},
mounted(){
  this.getStuData()
},
methods:{
  openDiale(val){
    this.row=val
    this.isShow=true
  },
  souParent(val){
   
    this.search=val
    this.getStuData()
  },
  souZhi(){
    this.search=''
    this.getStuData()
  },
  getStuData(){
    const params={
      search:this.search,
      page:this.page,
      pageSize:this.pageSize
    }
    getStu(params).then(res=>{
      console.log(res)
      if(res.code==200){
        this.arr=res.data
      }
    })
  }
}
}
</script>

<style lang="less" scope>
.xueyuan{
  text-align: left;
  .guan{
    margin: 20px 0;
    font-size: 20px;
  
    .fangkuai{
      width: 8px;
      height: 16px;
      display: inline-block;
      background: #64a5fa;
      margin-right: 14px;
      padding-top: 4px;
    }
  }
}
</style>